<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8" isELIgnored="false"%>
<!--引入JSTL核心标签库  core-->
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
.fa-refresh:before {
	content: "\f021";

}
.pageTitle{

width: 80px;
height: 40px;
font-family: "华文行楷";
font-size: 40px;

}
</style>
<meta charset="UTF-8">
<title>Insert title here</title>
<!-- Font Awesome -->
<link rel="stylesheet" href="plugins/fontawesome-free/css/all.min.css">

<!-- Ionicons -->
<link rel="stylesheet"
	href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css">
<!-- Tempusdominus Bbootstrap 4 -->
<link rel="stylesheet"
	href="${pageContext.servletContext.contextPath}/plugins/tempusdominus-bootstrap-4/css/tempusdominus-bootstrap-4.min.css">
<!-- iCheck -->
<link rel="stylesheet"
	href="${pageContext.servletContext.contextPath}/plugins/icheck-bootstrap/icheck-bootstrap.min.css">
<!-- JQVMap -->
<link rel="stylesheet"
	href="${pageContext.servletContext.contextPath}/plugins/jqvmap/jqvmap.min.css">
<!-- Theme style -->
<link rel="stylesheet"
	href="${pageContext.servletContext.contextPath}/css/adminlte.min.css">
<!-- overlayScrollbars -->
<link rel="stylesheet"
	href="${pageContext.servletContext.contextPath}/plugins/overlayScrollbars/css/OverlayScrollbars.min.css">
<!-- Daterange picker -->
<link rel="stylesheet"
	href="${pageContext.servletContext.contextPath}/plugins/daterangepicker/daterangepicker.css">
<!-- summernote -->
<link rel="stylesheet"
	href="${pageContext.servletContext.contextPath}/plugins/summernote/summernote-bs4.css">
<!-- Google Font: Source Sans Pro -->
<!--   <link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700" rel="stylesheet">
 -->
</head>
<body>

	<div class="container-fluid">
		<div class="row">
			<div class="col-12">
				<div class="card">
					<div class="card-header">
						<span class="pageTitle">管理员信息管理</span>
						<span ><i class="fa fa-refresh fa-fw" onclick="refresh()"></i> </span>
						<div class="card-tools">
							<div class="input-group input-group-sm" style="width: 150px;">
								<button type="button"
									class="btn btn-block btn-outline-secondary"
									style="margin-bottom: 2%; height: 35px;"
									onclick="openAddUser()">新增管理员</button>

								<input id="selectUser" type="text" name="table_search"
									class="form-control float-right" placeholder="用户名搜索">
								<div class="input-group-append">
									<button type="submit" class="btn btn-default"
										onclick="selectUserByName()">
										<i class="fas fa-search"></i>
									</button>
								</div>

							</div>
						</div>

					</div>
					<!-- /.card-header -->
					<div class="card-body table-responsive p-0" style="height: 80%;">
						<table class="table table-head-fixed text-nowrap">
							<thead>
								<tr>
									<th>班级编号</th>
									<th>班级名称</th>
									<th>操作</th>
								</tr>
							</thead>
							<tbody>
								<c:forEach items="${list }" var="c">
									<tr>
										<td>${c.c_id }</td>
										<td>${c.c_name }</td>

										<td>
											<button type="button" class="btn btn-warning btn-sm"
												onclick="modifyUser(${c.c_id })">修改</button>
											<button type="button" class="btn btn-danger btn-sm"
												onclick="deleteUser(${c.c_id })">删除</button>
										</td>
									</tr>
								</c:forEach>
							</tbody>
						</table>
					</div>
					<!-- /.card-body -->
				</div>
				<!-- /.card -->
			</div>
		</div>
	</div>

	<!-- 新增用户模态框 -->
	<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog"
		aria-labelledby="exampleModalLabel" aria-hidden="true">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<h5 class="modal-title" id="exampleModalLabel">新增用户</h5>
					<button type="button" class="close" data-dismiss="modal"
						aria-label="Close">
						<span aria-hidden="true">&times;</span>
					</button>
				</div>
				<div class="modal-body">
					<form>
						<div class="form-group">
							<label for="uname" class="col-form-label">用户名:</label> <input
								type="text" class="form-control" id="uname">
						</div>
						<div class="form-group">
							<label for="upass" class="col-form-label">密码:</label> <input
								type="text" class="form-control" id="upass">
							<!-- <textarea class="form-control" id="message-text"></textarea> -->
						</div>
						<div class="form-group">
							<label for="email" class="col-form-label">邮箱:</label> <input
								type="text" class="form-control" id="email">
						</div>
					</form>
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-secondary"
						data-dismiss="modal">关闭</button>
					<button type="button" onclick="addUser()" class="btn btn-primary">保存</button>
				</div>
			</div>
		</div>
	</div>

	<!-- 修改用户模态框 -->
	<div class="modal fade" id="exampleModal02" tabindex="-1" role="dialog"
		aria-labelledby="exampleModalLabel" aria-hidden="true">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<h5 class="modal-title" id="exampleModalLabel">修改用户</h5>
					<button type="button" class="close" data-dismiss="modal"
						aria-label="Close">
						<span aria-hidden="true">&times;</span>
					</button>
				</div>
				<div class="modal-body">
					<form>
						<input type="hidden" id="id02">
						<div class="form-group">
							<label for="uname" class="col-form-label">用户名:</label> <input
								type="text" class="form-control" id="uname02">
						</div>
						<div class="form-group">
							<label for="upass" class="col-form-label">密码:</label> <input
								type="text" class="form-control" id="upass02">
							<!-- <textarea class="form-control" id="message-text"></textarea> -->
						</div>
						<div class="form-group">
							<label for="email" class="col-form-label">邮箱:</label> <input
								type="text" class="form-control" id="email02">
						</div>
					</form>
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-secondary"
						data-dismiss="modal">关闭</button>
					<button type="button" onclick="saveModifyUser()"
						class="btn btn-primary">保存</button>
				</div>
			</div>
		</div>
	</div>

</body>
</html>
<!-- jQuery -->
<script
	src="${pageContext.servletContext.contextPath}/plugins/jquery/jquery.min.js"></script>
<!-- Bootstrap 4 -->
<script
	src="${pageContext.servletContext.contextPath}/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
<!-- AdminLTE App -->
<script
	src="${pageContext.servletContext.contextPath}/js/adminlte.min.js"></script>


<script>
	//添加用戶弹窗
	function openAddUser(){
		
		$('#exampleModal').modal({
			  keyboard: false
		});
	}
	
	//Ajax进行添加用户
	function addUser(){
		//从表单获取数据
		var uname=$("#uname").val();
		var upass=$("#upass").val();
		var email=$("#email").val();
		
		if(uname!=null&&uname!=''&&upass!=null&&upass!=''){
			
			//异步方式调用
			$.ajax({
				url:"addUser.do",
				data:{"uname":uname,"upass":upass,"email":email},
				success:function(data){
					if(data.code=="10000"){
						alert("添加成功");
						window.location.href="userList.do";
					}
					else{
						alert("添加失败");
					}
				}
			});
			
			
		}else{
			alert("信息未填写完善，请重新检查！");
		}
		
		
		
	}
	
	//Ajax进行删除用户
	function deleteUser(id){

		var msg = "确认删除该用户信息吗？\n注意：该操作无法恢复！";
        if (confirm(msg)==true){
           
        	$.ajax({
				url:"deleteUser.do",
				data:{"id":id},
				success:function(data){
					if(data.code=="10000"){
						alert("删除成功");
						window.location.href="userList.do";
					}
					else{
						alert("删除失败");
					}
				}
			});
        	

        }else{
        	alert("撤销删除操作成功");
        }

		
		}
	//Ajax进行读取用户信息，显示弹窗，打印到控件
	function modifyUser(id){
		
		
		$.ajax({
			url:"selectUserById.do",
			data:{"id":id},
			success:function(data){
				
				if(data.code=="10000"){
				
					$("#id02").val(data.data.id);
					$("#uname02").val(data.data.uname);
					$("#upass02").val(data.data.upass);
					$("#email02").val(data.data.email);
				}
				$('#exampleModal02').modal({
					  keyboard: false
				});	
					
			}
		});
		
		
	}
	//Ajax修改用户
	function saveModifyUser(){
		
		//从表单获取数据
		var id=$("#id02").val();
		var uname=$("#uname02").val();
		var upass=$("#upass02").val();
		var email=$("#email02").val();
		//异步方式调用
		$.ajax({
			url:"updateUser.do",
			data:{"uname":uname,"upass":upass,"email":email,"id":id},
			success:function(data){
				if(data.code=="10000"){
					alert("更新成功");
					window.location.href="userList.do";
				}
				else{
					alert("更新失败");
				}
			}
		});
		
		
	}
	
	function selectUserByName(){
		var uname=$(selectUser).val();
		window.location.href="userList.do?uname="+uname;
	}
	
	function refresh(){
		window.location.href="userList.do";
	}
	
	

	
</script>



